<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /***
         *  forEach
         *  map
         *  filter
         *  reduce
         *  some
         *  every
         *  find
         *  findIndex
         */

        var arr = ['a', 'b', 'c', 'd'];
        /**
         *  forEach 
         *  1. 作用：遍历数组
         *  2. 回调函数的第一个参数是数组中每一个元素，第二个参数是 索引/下标
         *  3. 没有返回值
         * 
         *  应用场景：涉及到数组遍历的
         */
        var res = arr.forEach(function (item, index) {
            console.log(item, index);
        })

        for (var i = 0; i < arr.length; i++) {
            console.log(i, arr[i]);
        }

        console.log(res);// undefined

        // 需求forEach数组求和
        var sum = 0;
        var arr = [2, 3, 5, 1, 4];
        arr.forEach(function (item, index) {
            sum += item;
        })
        console.log(sum);

        /**
         *  filter[过滤器]:
         *  作用：对数组中的数据进行筛选，返回值一个筛选后的新数组
         *  返回值：过滤后符合条件的数组
         * 
         *  应用场景：筛选符合条件的数据
         */
        console.log('filter-----');
        var users = [18, 29, 45, 7, 10, 12];
        /**
         * item：当前遍历的元素
         * index:索引
         * arr: 原数组
         * 
         * 
         */
        var res = users.filter(function (item, index, arr) {
            console.log('');
            return item < 18; // return true 将当前条 item 加入res数组中
            // return false，当前item就会被过滤掉，不会进入res数组
        })
        console.log('res:', res);
        /***
         * map[映射]:  
         * 1. 作用：将原数组中的每一个元素，经过自定义处理后，映射成一个新的数组，新数组的长度与原数组一样 
         * 2. 返回值：映射后的新数组
         * 
         */
        console.log('map-----');
        var arr = [4, 5, 23, 7, 89];
        var newArr = arr.map(function (item, index, arr) {
            return item * 3;
            // return 什么，当前遍历到这一条进入新数组的元素就是什么
        })
        console.log(newArr);

        /**
         *  reduce 累计
         *  参数：1 是一个回调函数 回调函数有三个参数 
         *              1：pre 第一次取值是 reduce的第二个参数  初始值
         *                     从第二次开始：取的是上一次回调函数的返回值
         *              2：当前元素 3：索引
         *        2. 初始值
         * 
         *  返回值：reduce回调函数最后一个的返回值
         */
        console.log(' reduce ----------')
        var arr = [1, 2, 3, 4, 5];
        var sum = arr.reduce(function (pre, cur, index) {
            console.log('pre: ', pre);
            console.log('cur: ', cur);
            console.log('index: ', index);
            return pre + cur;
            //       pre    cur     return 
            //  1     0      1        1
            //  2     1      2        3
            //  3     3      3        6
            //  4     6      4        10
            //  5     10     5        15     最后一次回调函数的返回值就是reduce最终的返回值  
        }, 0);
        console.log(sum);

        /***
         *  find 查找一个元素在数组中是否存在，如果存在返回符合条件的第一个元素
         *        如果没有符合条件的，返回值undefined
         * 
         */
        console.log(' find -------');
        var arr = [1, 3, 4, 'a', 3, 5, 'a'];
        var res = arr.find(function (item, index, arr) {
            return item === 13;
            // return index === 3;
        });
        console.log('res: ', res);

        /**
         * findIndex: 在数组中查找符合条件的元素下标，如果符合条件，返回符合条件的第一个元素的下标.
         *  如果没找到，返回-1
         * 
         */
        console.log('find Index ---------');
        var arr = [1, 3, 4, 'a', 3, 5, 'a'];
        var res = arr.findIndex(function (item, index, arr) {
            return item === 13;
            // return index === 3;
        });
        console.log('res: ', res);

        /**
         *  some : 
         *  返回：返回一个布尔值，但凡有一个符合条件的 true
         *        全都不符合条件，返回false
         */
        console.log('some --------');
        var arr = [9, 10, 12, 15, 19];
        var res = arr.some(function (item, index, arr) {
            return item < 8;
        })
        console.log('res: ', res);

        /**
         *  every
         *  返回值：也是布尔值
         *     1. 全都符合条件返回true
         *     2. 但凡有一个不符合的，返回false
         * 
         */
        console.log('every --------');
        var arr = [9, 10, 12, 15, 19];
        var res = arr.every(function (item, index, arr) {
            return item > 18;
        })
        console.log('res: ', res);




    </script>
</body>

</html>